<?php

    session_start();
    if(!isset($_SESSION['usuario'])){
            header('location:../html/login.html');
         }
         
         echo '
                <center>
                    <title>Administracion Camas Neonatales</title>
                    <table>
                        <tr>
                            <td>';
                         include_once 'menu.php';
                        echo"</td>
                        </tr>
                    </table>";
    
?>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script src="jquery-1.9.1.min.js"></script>
        <script type="text/javascript" src="../paletacolor/jscolor.js"></script>
        
        <!-- LIBRERIAS JQUERY PARA LA CREACION DE LAS ALERTAS -->
        <script type="text/javascript" src="../../Ginecobstetricia/vista/js/alertify.js"></script>
        <link rel="stylesheet" href="../../Ginecobstetricia/vista/css/alertify.core.css" />
        <link rel="stylesheet" href="../../Ginecobstetricia/vista/css/alertify.default.css" />
        
        <style>
        
            label,input,button,select,textarea{font-size:14px;font-weight:normal;line-height:20px}input,button,select,textarea{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif}label{display:block;margin-bottom:5px}select,textarea,input[type="text"],input[type="password"],input[type="datetime"],input[type="datetime-local"],input[type="date"],input[type="month"],input[type="time"],input[type="week"],input[type="number"],input[type="email"],input[type="url"],input[type="search"],input[type="tel"],input[type="color"],.uneditable-input{display:inline-block;height:28px;padding:4px 6px;margin-bottom:10px;font-size:14px;line-height:20px;color:#555;vertical-align:middle;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}input,textarea,.uneditable-input{width:170px}textarea{height:auto}textarea,input[type="text"],input[type="password"],input[type="datetime"],input[type="datetime-local"],input[type="date"],input[type="month"],input[type="time"],input[type="week"],input[type="number"],input[type="email"],input[type="url"],input[type="search"],input[type="tel"],input[type="color"],.uneditable-input{background-color:#fff;border:1px solid #ccc;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);-webkit-transition:border linear .2s,box-shadow linear .2s;-moz-transition:border linear .2s,box-shadow linear .2s;-o-transition:border linear .2s,box-shadow linear .2s;transition:border linear .2s,box-shadow linear .2s}textarea:focus,input[type="text"]:focus,input[type="password"]:focus,input[type="datetime"]:focus,input[type="datetime-local"]:focus,input[type="date"]:focus,input[type="month"]:focus,input[type="time"]:focus,input[type="week"]:focus,input[type="number"]:focus,input[type="email"]:focus,input[type="url"]:focus,input[type="search"]:focus,input[type="tel"]:focus,input[type="color"]:focus,.uneditable-input:focus{border-color:rgba(82,168,236,0.8);outline:0;outline:thin dotted \9;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6);-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6)}input[type="radio"],input[type="checkbox"]{margin:4px 0 0;margin-top:1px \9;*margin-top:0;line-height:normal}input[type="file"],input[type="image"],input[type="submit"],input[type="reset"],input[type="button"],input[type="radio"],input[type="checkbox"]{width:auto}select,input[type="file"]{height:30px;*margin-top:4px;line-height:30px}select{width:170px;background-color:#fff;border:1px solid #ccc}select[multiple],select[size]{height:auto}select:focus,input[type="file"]:focus,input[type="radio"]:focus,input[type="checkbox"]:focus{outline:thin dotted #333;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}.uneditable-input,.uneditable-textarea{color:#999;cursor:not-allowed;background-color:#fcfcfc;border-color:#ccc;-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,0.025);-moz-box-shadow:inset 0 1px 2px rgba(0,0,0,0.025);box-shadow:inset 0 1px 2px rgba(0,0,0,0.025)}.uneditable-input{overflow:hidden;white-space:nowrap}.uneditable-textarea{width:auto;height:auto}input:-moz-placeholder,textarea:-moz-placeholder{color:#999}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#999}input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{color:#999}.radio,.checkbox{min-height:20px;padding-left:20px}.radio input[type="radio"],.checkbox input[type="checkbox"]{float:left;margin-left:-20px}.controls>.radio:first-child,.controls>.checkbox:first-child{padding-top:5px}.radio.inline,.checkbox.inline{display:inline-block;padding-top:5px;margin-bottom:0;vertical-align:middle}.radio.inline+.radio.inline,.checkbox.inline+.checkbox.inline{margin-left:10px}.input-mini{width:60px}.input-small{width:90px}.input-medium{width:150px}.input-large{width:210px}.input-xlarge{width:270px}.input-xxlarge{width:530px}input[class*="span"],select[class*="span"],textarea[class*="span"],.uneditable-input[class*="span"],.row-fluid input[class*="span"],.row-fluid select[class*="span"],.row-fluid textarea[class*="span"],.row-fluid .uneditable-input[class*="span"]{float:none;margin-left:0}.input-append input[class*="span"],.input-append .uneditable-input[class*="span"],.input-prepend input[class*="span"],.input-prepend .uneditable-input[class*="span"],.row-fluid input[class*="span"],.row-fluid select[class*="span"],.row-fluid textarea[class*="span"],.row-fluid .uneditable-input[class*="span"],.row-fluid .input-prepend [class*="span"],.row-fluid .input-append [class*="span"]{display:inline-block}input,textarea,.uneditable-input{margin-left:0}.controls-row [class*="span"]+[class*="span"]{margin-left:20px}input.span12,textarea.span12,.uneditable-input.span12{width:926px}input.span11,textarea.span11,.uneditable-input.span11{width:846px}input.span10,textarea.span10,.uneditable-input.span10{width:766px}input.span9,textarea.span9,.uneditable-input.span9{width:686px}input.span8,textarea.span8,.uneditable-input.span8{width:606px}input.span7,textarea.span7,.uneditable-input.span7{width:526px}input.span6,textarea.span6,.uneditable-input.span6{width:446px}input.span5,textarea.span5,.uneditable-input.span5{width:366px}input.span4,textarea.span4,.uneditable-input.span4{width:286px}input.span3,textarea.span3,.uneditable-input.span3{width:206px}input.span2,textarea.span2,.uneditable-input.span2{width:126px}input.span1,textarea.span1,.uneditable-input.span1{width:46px}.controls-row{*zoom:1}.controls-row:before,.controls-row:after{display:table;line-height:0;content:""}.controls-row:after{clear:both}.controls-row [class*="span"],.row-fluid .controls-row [class*="span"]{float:left}.controls-row .checkbox[class*="span"],.controls-row .radio[class*="span"]{padding-top:5px}input[disabled],select[disabled],textarea[disabled],input[readonly],select[readonly],textarea[readonly]{cursor:not-allowed;background-color:#eee}input[type="radio"][disabled],input[type="checkbox"][disabled],input[type="radio"][readonly],input[type="checkbox"][readonly]{background-color:transparent}.control-group.warning .control-label,.control-group.warning .help-block,.control-group.warning .help-inline{color:#c09853}.control-group.warning .checkbox,.control-group.warning .radio,.control-group.warning input,.control-group.warning select,.control-group.warning textarea{color:#c09853}.control-group.warning input,.control-group.warning select,.control-group.warning textarea{border-color:#c09853;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075)}.control-group.warning input:focus,.control-group.warning select:focus,.control-group.warning textarea:focus{border-color:#a47e3c;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 6px #dbc59e;-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 6px #dbc59e;box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 6px #dbc59e}.control-group.warning .input-prepend .add-on,.control-group.warning .input-append .add-on{color:#c09853;background-color:#fcf8e3;border-color:#c09853}
            
            #camas{
                width: 400px;
                font-size: 15px;
                background-color: #E2ECEE;
                border: 1px solid #CED5D7;
                background-color: #58ACFA;
                -webkit-border-radius: 20px;
                -moz-border-radius: 20px;
                border-radius: 20px;
                padding:20px 20px 15px;
                margin-top: 5px;
                background-color: white;
                box-shadow: 0px 5px 10px #B5C1C5, 0 0 0 10px #EEF5F7 inset;
                font-size: 80%;
            }
            
            .white {
                border-radius: 5px;
                color: #606060;
                border: solid 1px #b7b7b7;
                background: #fff;
                background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
                background: -moz-linear-gradient(top,  #fff,  #ededed);
                filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
                padding: 4px 4px 4px;
                height: 30px;
                font-size: 13px;
            }
            .white:hover {
                background: #ededed;
                background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dcdcdc));
                background: -moz-linear-gradient(top,  #fff,  #dcdcdc);
                filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc');
            }
            .white:active {
                color: #999;
                background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#fff));
                background: -moz-linear-gradient(top,  #ededed,  #fff);
                filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff');
            }
        
        </style>
        
        
        <script>
            
            function insertarCama(){
                
                var tc = 1;
                var cama = $("#descama").val();
                var estado = $("#estado").val();
                
                if(cama == ""){
                    alertify.alert("Ingrese la descripcion de la cama", function () {
                        $("#descama").focus();
                    });
                    return false;
                }
                
                if(estado == 0){
                    alertify.alert("Seleccione el estado", function () {
                        $("#estado").focus();
                    });
                    return false;
                }
                
                alertify.confirm("Esta seguro de crear la cama?", function (e) {
                    if (e) {
                        $.ajax({
                            type: "POST",
                            dataType: "json",
                            contentType: "application/x-www-form-urlencoded;charset=UTF-8",
                            url: "../../EntregaT/controlador/consultas/crudCama.php",
                            data: {tc:tc,cama:cama,estado:estado},
                            success: respcamas,
                            timeout: 4000
                        });
                    } else { 
                        
                    }
                }); 
                return false;
            }
            
            function respcamas(){
                
                document.getElementById("descama").value = "";
                document.getElementById("estado").value = "0";
                document.getElementById("oidcama").value = "";
                cargarCamas();
                
            }
            
            function cargarCamas(){
                
                var tc = 2;
                
                $.ajax({
                    type: "POST",
                    contentType: "application/x-www-form-urlencoded;charset=UTF-8",
                    url: "../../EntregaT/controlador/consultas/crudCama.php",
                    data: {tc:tc},
                    success: mostrarCamas,
                    timeout: 4000
                });
                
            }
            
            function mostrarCamas(datos){
                $("#tablacam").text('');
                rpt = $.parseJSON(datos);
                datos = $("#tablacam");
                
                var resp = "";
                var con = 1; 
                
                resp += "<table style='width:100%;font-size:70%'>\
                            <tr>\
                                <td align='center' style='padding:10px;background-color: whitesmoke;border-radius:5px'>\
                                </td>\
                                <td align='center' style='padding:10px;background-color: whitesmoke;border-radius:5px'>\
                                    <strong>Descripcion de la Cama</strong>\
                                </td>\
                                <td align='center' style='padding:10px;background-color: whitesmoke;border-radius:5px'>\
                                    <strong>Estado de la Cama</strong>\
                                </td>\
                            </tr>";
                for(r in rpt){
                    
                    var esta = rpt[r].estado;
                    
                    if(esta == 1){
                        var estado = "Activa"; 
                    }else if(esta == 2){
                        estado = "Inactiva";
                    }
                    
                    var descricam = '"'+rpt[r].descripcion+'"';
                    
                    resp += "<tr style='cursor:pointer;' onclick='cargarCam("+ rpt[r].oid +","+ descricam +","+ rpt[r].estado +");'>\
                                <td style='padding:10px 10px 10px; text-align:center;border-top:1px solid #e0e0e0; border-right:1px solid #e0e0e0;background: -moz-linear-gradient(100% 25% 90deg, #fefefe, #f9f9f9);background: -webkit-gradient(linear, 0% 0%, 0% 25%, from(#f9f9f9), to(#fefefe));'>\
                                    "+ con +"\
                                </td>\
                                <td style='padding:10px 10px 10px; text-align:center;border-top:1px solid #e0e0e0; border-right:1px solid #e0e0e0;background: -moz-linear-gradient(100% 25% 90deg, #fefefe, #f9f9f9);background: -webkit-gradient(linear, 0% 0%, 0% 25%, from(#f9f9f9), to(#fefefe));'>\
                                    "+ rpt[r].descripcion +"\
                                </td>\
                                <td style='padding:10px 10px 10px; text-align:center;border-top:1px solid #e0e0e0; border-right:1px solid #e0e0e0;background: -moz-linear-gradient(100% 25% 90deg, #fefefe, #f9f9f9);background: -webkit-gradient(linear, 0% 0%, 0% 25%, from(#f9f9f9), to(#fefefe));'>\
                                    "+ estado +"\
                                </td>\
                             </tr>";
                   con++;
                }
                resp += "</table>";
                datos.append(resp);
                
            }
            
            function cargarCam(oid,descricam,estado){
                
                document.getElementById("descama").value = descricam;
                document.getElementById("estado").value = estado;
                document.getElementById("oidcama").value = oid;
                
                
                document.getElementById("botonA").innerHTML = '<input class="white" type="button" value="Guardar Cambios" onclick="editarCama();"/>';
                document.getElementById("botonB").innerHTML = '<input class="white" type="button" value="Cancelar" onclick="cancel();"/>';
                
            }
            
            function botones(){
                
                document.getElementById("botonA").innerHTML = '<input class="white" type="button" value="Guardar" onclick="insertarCama();"/>';
                document.getElementById("botonB").innerHTML = '<input class="white" type="reset" value="Limpiar" />';
                
            }
            
            function cancel(){
                
                document.getElementById("descama").value = "";
                document.getElementById("estado").value = "0";
                document.getElementById("oidcama").value = "";
                botones();
                
            }
            
            function editarCama(){
                
                var descricama = document.getElementById("descama").value;
                var estadocama = document.getElementById("estado").value;
                var oidcama = document.getElementById("oidcama").value;
                var tc = 3;
                
                alertify.confirm("Desea guardar los cambios?", function (e) {
                    if (e) {
                        $.ajax({
                            type: "POST",
                            dataType: "json",
                            contentType: "application/x-www-form-urlencoded;charset=UTF-8",
                            url: "../../EntregaT/controlador/consultas/crudCama.php",
                            data: {tc:tc,oidcama:oidcama,descricama:descricama,estadocama:estadocama},
                            success: mostrarEdiCam,
                            timeout: 4000
                        });
                    } else { 
                        
                    }
                }); 
                return false;
                
            }
            
            function mostrarEdiCam(){
                
                document.getElementById("descama").value = "";
                document.getElementById("estado").value = "0";
                document.getElementById("oidcama").value = "";
                cargarCamas();
                
            }
            
            function insertarClasi(){
                
                var descripcion = $("#descric").val();
                var color = $("#colores").val();
                var estado = $("#estadoc").val();
                var tc = 1;
                
                if(descripcion == ""){
                    alertify.alert("Ingrese la descripcion de la clasificacion", function () {
                        $("#descric").focus();
                    });
                    return false;
                }
                /*if(color == ""){
                    alertify.alert("Seleccione color", function () {
                        $("#colores").focus();
                    });
                    return false;
                }*/
                if(estado == "0"){
                    alertify.alert("Seleccione el estado de la clasificacion", function () {
                        $("#estadoc").focus();
                    });
                    return false;
                }
                
                alertify.confirm("Esta seguro de crear la clasificacion?", function (e) {
                    if (e) {
                        $.ajax({
                        type: "POST",
                        dataType: "json",
                        contentType: "application/x-www-form-urlencoded;charset=UTF-8",
                        url: "../../EntregaT/controlador/consultas/crudClasificacion.php",
                        data: {tc:tc,descripcion:descripcion,color:color,estado:estado},
                        success: respClasif,
                        timeout: 4000
                    });
                    } else { 
                        
                    }
                }); 
                return false;
                
            }
            
            
            function respClasif(){
                
                document.getElementById("descric").value = "";
                document.getElementById("estadoc").value = "0";
                document.getElementById("colores").value = "FFFFFF";
                cargarClasif();
                
            }
            
            function cargarClasif(){
                
                var tc = 2;
                
                $.ajax({
                    type: "POST",
                    contentType: "application/x-www-form-urlencoded;charset=UTF-8",
                    url: "../../EntregaT/controlador/consultas/crudClasificacion.php",
                    data: {tc:tc},
                    success: mostrarClasif,
                    timeout: 4000
                });
                
            }
            
            function mostrarClasif(datos){
                
                $("#tablaclasif").text('');
                rpt = $.parseJSON(datos);
                datos = $("#tablaclasif");
                
                var resp = "";
                var con = 1; 
                
                resp += "<table style='width:100%;font-size:70%'>\
                            <tr>\
                                <td align='center' style='background-color: whitesmoke;border-radius:5px'>\
                                </td>\
                                <td align='center' style='padding:10px;background-color: whitesmoke;border-radius:5px'>\
                                    <strong>Clasificacion</strong>\
                                </td>\
                                <td align='center' style='padding:10px;background-color: whitesmoke;border-radius:5px'>\
                                    <strong>Color</strong>\
                                </td>\
                                <td align='center' style='padding:10px;background-color: whitesmoke;border-radius:5px'>\
                                    <strong>Estado</strong>\
                                </td>\
                            </tr>";
                for(r in rpt){
                    
                    var esta = rpt[r].estado;
                    
                    if(esta == 1){
                        var estado = "Activa"; 
                    }else if(esta == 2){
                        estado = "Inactiva";
                    }
                    
                    var descricam = '"'+rpt[r].descripcion+'"';
                    var color = '"'+rpt[r].color+'"';
                    
                    resp += "<tr style='cursor:pointer;' onclick='cargarClasifi("+ rpt[r].oid +","+ descricam +","+ color +","+ rpt[r].estado +");'>\
                                <td style='padding:10px 10px 10px; text-align:center;border-top:1px solid #e0e0e0; border-right:1px solid #e0e0e0;background: -moz-linear-gradient(100% 25% 90deg, #fefefe, #f9f9f9);background: -webkit-gradient(linear, 0% 0%, 0% 25%, from(#f9f9f9), to(#fefefe));'>\
                                    "+ con +"\
                                </td>\
                                <td style='padding:10px 10px 10px; text-align:center;border-top:1px solid #e0e0e0; border-right:1px solid #e0e0e0;background: -moz-linear-gradient(100% 25% 90deg, #fefefe, #f9f9f9);background: -webkit-gradient(linear, 0% 0%, 0% 25%, from(#f9f9f9), to(#fefefe));'>\
                                    "+ rpt[r].descripcion +"\
                                </td>\
                                <td style='padding:10px 10px 10px; text-align:center;border-top:1px solid #e0e0e0; border-right:1px solid #e0e0e0;background: -moz-linear-gradient(100% 25% 90deg, #fefefe, #f9f9f9);background: -webkit-gradient(linear, 0% 0%, 0% 25%, from(#f9f9f9), to(#fefefe));'>\
                                    "+ rpt[r].color +"\
                                </td>\
                                <td style='padding:10px 10px 10px; text-align:center;border-top:1px solid #e0e0e0; border-right:1px solid #e0e0e0;background: -moz-linear-gradient(100% 25% 90deg, #fefefe, #f9f9f9);background: -webkit-gradient(linear, 0% 0%, 0% 25%, from(#f9f9f9), to(#fefefe));'>\
                                    "+ estado +"\
                                </td>\
                             </tr>";
                   con++;
                }
                resp += "</table>";
                datos.append(resp);
                
            }
            
            function cargarClasifi(oid,descricam,color,estado){
                
                document.getElementById("descric").value = descricam;
                document.getElementById("colores").value = color;
                document.getElementById("estadoc").value = estado;
                document.getElementById("oidclasif").value = oid;
                
                
                document.getElementById("botonescA").innerHTML = '<input class="white" type="button" value="Guardar Cambios" onclick="editarClasif();"/>';
                document.getElementById("botonescB").innerHTML = '<input class="white" type="button" value="Cancelar" onclick="cancel2();"/>';
                
            }
            
            function botonesc(){
                
                document.getElementById("botonescA").innerHTML = '<input class="white" type="button" value="Guardar" onclick="insertarClasi();"/>';
                document.getElementById("botonescB").innerHTML = '<input class="white" type="reset" value="Limpiar" />';
                
            }
            
            function cancel2(){
                
                document.getElementById("descric").value = "";
                document.getElementById("estadoc").value = "0";
                document.getElementById("colores").value = "";
                document.getElementById("oidclasif").value = "";
                botonesc();
                
            }
            
            function editarClasif(){
                
                var descripcion = $("#descric").val();
                var color = $("#colores").val();
                var estado = $("#estadoc").val();
                var oid = $("#oidclasif").val();
                var tc = 3;
                
                
                alertify.confirm("Desea guardar los cambios?", function (e) {
                    if (e) {
                        $.ajax({
                            type: "POST",
                            dataType: "json",
                            contentType: "application/x-www-form-urlencoded;charset=UTF-8",
                            url: "../../EntregaT/controlador/consultas/crudClasificacion.php",
                            data: {tc:tc,oid:oid,descripcion:descripcion,color:color,estado:estado},
                            success: mostrarEdiClasif,
                            timeout: 4000
                        });
                    } else { 
                        
                    }
                }); 
                return false;
                
            }
            
            function mostrarEdiClasif(){
                
                document.getElementById("descric").value = "";
                document.getElementById("estadoc").value = "0";
                document.getElementById("colores").value = "FFFFFF";
                cargarClasif();
                
            }
            
        </script>
        
    </head>
    <body onload='cargarCamas();botones();cargarClasif();botonesc();'>
        <table>
            <tr>
                <td>
                    <form>
                        <table id="camas">
                            <tr>
                                <td colspan="2" align="center" style="padding: 10px;">
                                    CAMAS NEONATALES
                                </td>
                            </tr>
                            <tr>
                               <td>
                                   Descripción:
                               </td>
                               <td>
                                   <input type="text" name="txtdesca" id="descama" value="" />
                                   <input type="hidden" name="txtoidcam" value="" id="oidcama"/>
                               </td>
                            </tr>
                            <tr>
                               <td>
                                   Estado:
                               </td>
                               <td>
                                   <select name="cbestado" id="estado">
                                       <option value="0">Seleccione</option>
                                       <option value="1">Activo</option>
                                       <option value="2">Inactivo</option>
                                   </select>
                               </td>
                            </tr>
                            <tr>
                                <td colspan="2" align="right">
                                    <table>
                                        <tr>
                                            <td>
                                                <div id="botonA"></div>
                                            </td>
                                            <td>
                                                <div id="botonB"></div>
                                            </td>
                                        </tr>
                                    </table>
                                </td>
                            </tr>
                        </table>
                    </form>
                </td>
                <td style="width: 3px;">
                    
                </td>
                <td>
                    <table style="overflow:hidden;border:1px solid #d3d3d3;background:#fefefe;width:700px;height: 180px;-moz-border-radius:5px; /* FF1+ */-webkit-border-radius:5px; /* Saf3-4 */border-radius:5px;-moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);-webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);">
                        <tr>
                            <td>
                                <div id='tablacam' style="overflow-y: scroll;height: 170px;"></div>
                            </td>
                        </tr>
                    </table>
                </td>
             </tr>
             <tr>
                 <td colspan="2">
                     
                 </td>
             </tr>
             <tr>
                <td>
                    <form>
                        <table id="camas">
                            <tr>
                                <td colspan="2" align="center" style="padding: 10px;">
                                    CLASIFICACIONES
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    Descripción:
                                </td>
                                <td>
                                    <input type="text" name="txtdescric" id="descric" value="" />
                                    <input type="hidden" name="txtoidclasif" value="" id="oidclasif"/>
                                </td>
                            </tr>
                            <tr>
                               <td>
                                   Color:
                               </td>
                               <td>
                                   <input class="color" value="" id="colores"
                               </td>
                            </tr>
                            <tr>
                               <td>
                                   Estado:
                               </td>
                               <td>
                                   <select name="cbestadco" id="estadoc">
                                       <option value="0">Seleccione</option>
                                       <option value="1">Activo</option>
                                       <option value="2">Inactivo</option>
                                   </select>
                               </td>
                            </tr>
                            <tr>
                                <td align="right" colspan="2">
                                    <table>
                                        <tr>
                                            <td>
                                                <div id="botonescA">
                                                    
                                                </div>
                                            </td>
                                            <td>
                                                <div id="botonescB">
                                                    
                                                </div>
                                            </td>
                                        </tr>
                                    </table>
                                </td>
                            </tr>
                        </table>
                    </form>
                </td>
                <td style="width: 3px;">
                    
                </td>
                <td>
                    <table style="overflow:hidden;border:1px solid #d3d3d3;background:#fefefe;width:700px;height: 223px;-moz-border-radius:5px; /* FF1+ */-webkit-border-radius:5px; /* Saf3-4 */border-radius:5px;-moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);-webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);">
                        <tr>
                            <td>
                                <div style="overflow-y: scroll;height: 210px;" id="tablaclasif"></div>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
    </body>
</html>